<template>
  <laker-dialog
    v-model="visible"
    title="日计划明细"
    width="900"
    height="900"
    :show-fullscreen="true"
    :show-close="true"
    destroy-on-close
    @closed="$emit('closed')"
  >
    <el-container>
      <el-main>
        <laker-table ref="table" :apiObj="apiObj" :params="params" size="small" height="510px" border>
          <el-table-column label="公司名称" prop="compName" width="100"></el-table-column>
          <el-table-column label="机组/场站" prop="unitCode" width="100" :formatter="formatDict"></el-table-column>
          <el-table-column label="任务类型" prop="planType" :formatter="formatDict" width="100"></el-table-column>
          <el-table-column label="工作项目" prop="planName" width="200"></el-table-column>
          <el-table-column label="是否高风险" prop="highRisk" width="100" :formatter="formatDict"></el-table-column>
          <el-table-column label="风险类型" prop="riskType" :formatter="formatDict" width="100"></el-table-column>
          <el-table-column
            label="是否重点管控作业"
            prop="keyControl"
            width="120"
            :formatter="formatDict"
          ></el-table-column>
          <el-table-column label="是否临时外包" prop="tempOuts" width="100" :formatter="formatDict"></el-table-column>
          <el-table-column label="计划开始时间" prop="planBeg" width="120"></el-table-column>
          <el-table-column label="计划结束时间" prop="planEnd" width="120"></el-table-column>
          <el-table-column label="取票时间" prop="tikectDate" width="120"></el-table-column>
          <el-table-column label="工作负责人" prop="workLeader" width="100"></el-table-column>
          <el-table-column label="负责人电话" prop="leaderPhone" width="110"></el-table-column>
          <el-table-column label="重点作业管控人" prop="contrlLeader" width="110"></el-table-column>
          <el-table-column label="责任专业" prop="sklId" width="100" :formatter="formatDict"></el-table-column>
          <el-table-column label="工作票类型" prop="tikectType" :formatter="formatDict" width="100"></el-table-column>
          <el-table-column label="发票优先级" prop="tikectPriority" width="100"></el-table-column>
          <el-table-column label="实施班组" prop="groupName" width="100"></el-table-column>
          <el-table-column label="计划类别" prop="planCategory" width="100"></el-table-column>
          <el-table-column label="安监人员" prop="safeLeader" width="100"></el-table-column>
          <el-table-column label="备注事由" prop="planDsc" width="100"></el-table-column>
          <el-table-column label="状态" prop="validSta" :formatter="formatDict" width="100"></el-table-column>
        </laker-table>
      </el-main>
    </el-container>
  </laker-dialog>
</template>

<script>
import LakerDialog from '@/components/lakerDialog/index.vue'
import LakerTable from '@/components/lakerTable/index.vue'
import { dayjs } from 'element-plus'
import dprevent from '@/api/dprevent'
import isepApp from '@/api/isep'

export default {
  name: 'OmoPdtaskplanDialog',
  components: { LakerDialog, LakerTable },
  emits: ['success', 'closed'],
  data() {
    return {
      dialog: {
        raDialog: false,
        scTable: false,
        siTable: false,
        video: false
      },
      apiObj: isepApp.getPdtaskplanPage,
      params: { validSta: '00' },
      mode: 'add',
      visible: false,
      titleMap: {
        add: '选择设备类型',
        edit: '编辑人员',
        show: '查看'
      },
      elmain: 'elmain',
      today: dayjs().format('YYYY-MM-DD'),
      risk01: 0,
      dataList: [],
      dictData: {
        planType: [
          { value: '01', label: '高风险作业' },
          { value: '02', label: '临时外包' },
          { value: '03', label: '常规作业' },
          { value: '04', label: '检修部' }
        ],
        riskType: [
          { value: '01', label: '高处作业' },
          { value: '02', label: '有限空间作业' },
          { value: '03', label: '其他' }
        ],
        tikectType: [
          { value: '01', label: '电气一种票' },
          { value: '02', label: '电气二种票' },
          { value: '11', label: '热机一种票' },
          { value: '12', label: '热机二种票' },
          { value: '21', label: '热控一种票' },
          { value: '22', label: '热控二种票' }
        ],
        validSta: [
          { value: '00', label: '进行中' },
          { value: '99', label: '已完成' }
        ],
        createBy: [],
        updateBy: [],
        unitCode: [
          { value: '01', label: '#1机组' },
          { value: '02', label: '#2机组' },
          { value: '00', label: '全厂公用' }
        ],
        highRisk: [
          { value: 'Y', label: '是' },
          { value: 'N', label: '否' }
        ],
        keyControl: [
          { value: 'Y', label: '是' },
          { value: 'N', label: '否' }
        ],
        tempOuts: [
          { value: 'Y', label: '是' },
          { value: 'N', label: '否' }
        ],
        planCategory: [
          { value: '00', label: '新开' },
          { value: '01', label: '持续' }
        ]
      }
    }
  },
  mounted() {
    this.getApiData()
    // document.querySelector('html').classList.add('dark')
  },
  methods: {
    open() {
      this.visible = true
      return this
    },
    formatDict(row, column, cellValue) {
      const dictList = this.dictData[column.property]
      let label = cellValue
      if (dictList) {
        dictList.forEach((element) => {
          if (element.value == cellValue) {
            label = element.label
          }
        })
      }
      return label
    },
    getApiData() {
      dprevent.getHdSignuser().then((res) => {
        if (res.code === 'success') {
          if (res.result) {
            this.dataList = res.result
          }
        }
      })
    },
    close() {
      this.visible = false
      return this
    },
    //表单注入数据
    setData(data) {
      console.log(data)
    }
  }
}
</script>

<style scoped lang="scss">
:deep(.el-table) {
  /* 透明度为0，不显示背景色 */
  background-color: rgba(255, 240, 240, 0);
}

/* 头部标题组件 */
:deep(.el-table th.el-table__cell) {
  /* 透明度为0，不显示背景色 */
  background-color: rgba(255, 0, 0, 0);
  /* 文字颜色 */
  color: yellowgreen;
  /* 背景图片，可以为表格头部设置背景颜色，不过如果背景是透明的，
  可以直接把父div的背景图片当做是这里的图片，只要把表格放在对应的位置就行了，
  看自己选择
  */
  /* background-image: url("https://element-plus.org/images/element-plus-logo.svg"); */
}

/* 表格行背景色 */
:deep(.el-table tr) {
  /* 透明度为0，不显示背景色 */
  background-color: rgba(255, 0, 0, 0);
  /* 文字颜色 */
  color: skyblue;
}

/* 表格底部分割线，不知道表达的是什么，注释一下这个就知道了  */
:deep(.el-table__inner-wrapper:before) {
  bottom: 0;
  height: 0px;
  left: 0;
}

/* 鼠标悬停背景色 */
:deep(.el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell) {
  background-color: rgba(116, 85, 228, 0.671);
}

/* 鼠标选中背景色，行点击事件 */
:deep(.el-table__body tr.current-row > td.el-table__cell) {
  background-color: green;
}
</style>
